<template>
    <div>
        <input type="text" ref="input">
        <button @click="getValue">取出input输入框中的值</button>
        <hr>
        <hr>
        <hr>
        <hr>
        <hr>
        <hr>
        <button ref="btn" v-for="(num,index) in 5" :key="index">{{num}}</button>
        <button @click="getdata">取值</button>
        <hr>
        <hr>
        <hr>
        <hr>
        <child ref="com" ></child>
        <button @click="getComm">取组件</button>
        <slot></slot>
    </div>
</template>

<script>
import child from './child'
export default {
    methods: {
        getValue(){
            console.log(this.$refs.input.value);
        },
        getdata(){
            console.log(this.$refs.btn);
        },
        getComm(){
            console.log(this.$refs.com.msg)
        }
    },
    components:{
        child,
    }
}
</script>

<style>

</style>